$(function () {
  var vm = new Vue({
    el: "#app",
    data: {
      // 统计数据
      statistics: {
        projectSum: 0,
        totalCalls: 0,
        todaySum: 0,
        browseSum: 0,
      },
      inputVal: "", // 输入框
      categorys: [], // 标签分类
      conditions: [], // 条件
      models: [], // 模型类别
      currentModel: {}, // 当前模型
      hotkeys: [], // 热词
      dataList: [], // 数据列表
      cur: 1, // 当前页
      allNum: 1, // 总页数
      pageSize: 15, // 每页条数
      isShowexpandNav: false, // 展开标志位
      userName: '',
      apiUrl:  window.location.href.indexOf('127.0.0.1') > -1  ?'http://39.106.120.139':'',
      dataTabActive: 0
    },
    created: function () {
      console.log(Hu.Cookies.get('HuUserName'))
      this.userName = Hu.Cookies.get('HuUserName') || ''
      // this.getStatistics(); // 获取统计
      this.getHotKey(); // 获取热词
      this.getCategorys(); // 获取标签分类
      this.getModels(); // 获取模型类别
      this.getDataList(); // 获取类别数据
    },
    mounted: function () {
      
    },
    computed: {
        // 分页索引
        indexs: function() {
            var _this = this;
            var left = 1; //默认起始值是1
            var right = _this.allNum; //终止值是全部
            var arr = [];
            if(this.allNum>= 5){
                if(this.cur > 3 && this.cur < this.allNum-2){
                        left = this.cur - 2
                        right = this.cur + 2
                }else{
                    if(this.cur<=3){
                        left = 1
                        right = 5
                    }else{
                        right = this.allNum
                        left = this.allNum -4
                    }
                }
            }
            while (left <= right){
                arr.push(left)
                left ++
            }
            return arr
        }
    },
    methods: {
      getStatistics: function () {
        //const _this = this;
        //$.ajax({
        //    url: "/ProjectApi/GetList",
        //    data: {
        //        pageIndex: 1,
        //        pageSize:15,
        //        keyWord:"",
        //        Project_TypeId:"",
        //        Project_LabelId:""
        //    },
        //  type: "get",
        //  cache: false,
        //  dataType: "json",
        //  success: function (data) {
        //    console.log(data.data);
        //    if (data.data.statistics) {
        //      _this.statistics = data.data.statistics;
        //    }
        //  },
        //  error: function () {
        //    // view("异常！");
        //    alert("异常！");
        //  },
        //});
      },
      getHotKey: function () {
        const _this = this;
        $.ajax({
            url: _this.apiUrl + "/ProjectApi/Indexdata",
            // url: "http://39.106.120.139/ProjectApi/Indexdata",
          data: {},
          type: "get",
          cache: false,
          dataType: "json",
          success: function (data) {
            console.log(data.data);
            if (data.data.hotkeys) {
                _this.hotkeys = data.data.hotkeys;
                _this.categorys = data.data.categorys;
                _this.statistics = data.data.statistics;
            }
          },
          error: function (e) {
            // view("异常！");
            console.log('error', e);
            // alert("异常！");
          },
        });
      },
      getCategorys: function () {
        //const _this = this;
        //$.ajax({
        //    url: "/ProjectApi/Indexdata",
        //  data: {},
        //  type: "get",
        //  cache: false,
        //  dataType: "json",
        //  success: function (data) {
        //    console.log(data.data);
        //    if (data.data) {
        //      _this.categorys = data.data.categorys;
        //    }
        //  },
        //  error: function () {
        //    // view("异常！");
        //    alert("异常！");
        //  },
        //});
      },
      getModels: function () {
        const _this = this;
        $.ajax({
            url: _this.apiUrl + "/ProjectApi/GetSelectString",
            // url: "http://39.106.120.139/ProjectApi/GetSelectString",
          data: {},
          type: "get",
          cache: false,
          dataType: "json",
          success: function (data) {
            console.log(data.data);
            if (data.data) {
              _this.models = data.data;
            }
          },
          error: function (e) {
            // view("异常！");
            console.log('error', e);
            // alert("异常！");
          },
        });
      },
      getDataList: function (index) {
        const _this = this;
        console.log("搜索条件：", this.conditions)
        $.ajax({
            url: _this.apiUrl + "/ProjectApi/GetList",
            // url: "http://39.106.120.139/ProjectApi/GetList",
          data: {
              pageSize: this.pageSize,
              pageIndex: index || 1,
              keyWord:"",
              Project_TypeId:"",
              Project_LabelId:"",
              conditions: this.conditions,
              sort: this.dataTabActive
          },
          type: "post",
          cache: false,
          dataType: "json",
          success: function (data) {
            console.log(data.data);
            if (data.data.dataList) {
              _this.dataList = data.data.dataList;
              _this.allNum = data.data.totalPage;
              _this.cur = data.data.pageNum
            }
          },
          error: function (e) {
            // view("异常！");
            console.log('error', e);
            // alert("异常！");
          },
        });
      },
      search: function () {
        this.createConditions({ type: "key", value: this.inputVal });
      },
      getType: function (type) {
        if (typeof type !== "string") {
          return;
        }
        switch (type) {
          case "key":
            return "关键词: ";
          case "tag":
            return "类别: ";
          default:
            return "";
        }
      },
      // 切换筛选条件
      createConditions: function (item) {
        if (item.type === "key") {
          this.conditions = this.conditions.filter((_item) => {
            _item.type !== item.type;
          });
          if (!item.value) {
            return;
          }
        }
        this.conditions = this.conditions.concat(item);
        const dict = {};
        for (const item of this.conditions) {
          dict[item.type + "," + item.value] = item;
        }
        this.conditions = Object.values(dict);
        this.getDataList() // 改变条件时重新获取数据
      },
      // 关闭一项条件
      closeConditions: function (item) {
        this.conditions = this.conditions.filter(function (_item) {
          return _item.value !== item.value || _item.type !== item.type;
        });
        this.getDataList() // 改变条件时重新获取数据
      },
      // 分页
      btnClick: function(data) {
          if(data!= this.cur){
              this.cur =data
          }
          this.getDataList(this.cur)
      },
      pageClick: function(){
          this.getDataList(this.cur)
      },
      // card顶部随机颜色
      randomColor: function() {
        let r = Math.floor(Math.random()*256)
        let g = Math.floor(Math.random()*256)
        let b = Math.floor(Math.random()*256)
        return "rgb("+r+','+g+','+b+")"
      },
      // 分类展开
      showExpandNav: function(item) {
        this.isShowexpandNav = true;
        console.log(item)
        this.currentModel = item
      },
      // 分类收起
      hideExpandNav: function() {
        this.isShowexpandNav = false;
      },
      // 切换dataTab
      changeDataTab: function(index) {
        console.log(index)
        this.dataTabActive = index
        this.getDataList()
      }
    },
  });
});
